<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>shopping-cart</title>
    <link rel="stylesheet" href="/css/base.css">
    <link rel="stylesheet" href="/css/public.css">
    <link rel="stylesheet" href="/css/shopping-cart.css">

    <script src="/lib/require/require.js" data-main="/js/shooping-cart"></script>

</head>
<body>
    
    <!-- header -->
    <header></header>


    <!-- 内容区 -->
    <div class="content">
        <!-- 收货信息 -->
        <div class="shopping-box wrap" id="writeAddress">
            <h4 class="shopping-box-title">收货信息</h4>
            <div class="shopping-add">
                <div class="shopping-add-left">
                    <p>收件人</p>
                    <p>所在地区</p>
                    <p>详细地址</p>
                </div>
                <div class="shopping-add-middle">
                    <div class="shopping-add-middle-row">
                        <input class="name" type="text" placeholder="请输入收件人姓名">
                        <div class="phone">
                            <span>手机号码</span>
                            <input type="text" class="phone-input" placeholder="请输入手机号码">
                        </div>
                    </div>
                    <div class="shopping-add-middle-row">
                        <select name="" id="province">
                            <option value="天津">天津</option>
                            <option value="北京">北京</option>
                            <option value="上海">上海</option>
                            <option value="广州">广州</option>
                            <option value="深圳">深圳</option>
                            <option value="成都">成都</option>
                        </select>
                        <select name="" id="city">
                            <option value="天津">天津</option>
                            <option value="北京">北京</option>
                            <option value="上海">上海</option>
                            <option value="广州">广州</option>
                            <option value="深圳">深圳</option>
                            <option value="成都">成都</option>
                        </select>
                        <select name="" id="area">
                            <option value="天津">天津</option>
                            <option value="北京">北京</option>
                            <option value="上海">上海</option>
                            <option value="广州">广州</option>
                            <option value="深圳">深圳</option>
                            <option value="成都">成都</option>
                        </select>
                    </div>
                    <div class="shopping-add-middle-row">
                       <textarea name="" id="delute" ></textarea>
                    </div>
                </div>
                <div class="shopping-add-right fr">
                    <div class="shopping-add-right-top">
                        <!-- <input type="checkbox">
                        <span>设为默认</span> -->
                    </div>
                    <a class="set-default-add" href="javascript:void(0);">确认</a>
                </div>
            </div>
        </div>
        <!-- 收货信息 -->
        <div class="shopping-box wrap" id="defaultAddress" style="display:none;">
            <h4 class="shopping-box-title">收货信息</h4>
            <div class="shopping-add">
                <div class="shopping-add-left">
                    <p><a class="modify" href="javascript:void(0);">修改</a></p>
                    <p>收货人：</p>
                    <p>联系电话：</p>
                    <p>收货地址：</p>
                </div>
                <div class="shopping-add-middle">
                    <p class="consignee"></p>
                    <p class="contact-number"></p>
                    <p class="receiving-address"></p>
                </div>
                <div class="shopping-add-right fr">
                    <div class="shopping-add-right-top">
                        <span class="toggle-address">切换地址</span>
                    </div>
                    <a class="new-address" href="javascript:void(0);">新建地址</a>
                </div>
            </div>
        </div>
        <!-- 购买商品列表 -->
        <div class="shopping-product-list wrap">
            <!-- 商品列表标题 -->
            <div class="shopping-product-list-title">
                <div class="shopping-message">
                    <span>商品信息</span>
                </div>
                <div class="shopping-price">
                    <span>单价</span>
                </div>
                <div class="shopping-pub">
                    <span>数量</span>
                </div>
                <div class="shopping-pub">
                    <span>优惠</span>
                </div>
                <div class="shopping-pub">
                    <span>总价</span>
                </div>
            </div>
            <!-- 商品列表每一项 -->
            <div class="shopping-product-list-box">
                
            </div>
            <!-- 结算信息汇总 -->
            <div class="summary">
                <div class="summary-left fl">
                    <p>使用优惠</p>
                    <p>备&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;注</p>
                </div>
                <div class="summary-middle fl">
                    <p>
                        <select name="" id="">
                            <option value="">无可用优惠活动</option>
                            <option value="">无可用优惠活动</option>
                        </select>
                    </p>
                    <textarea name="" id="" >备注最多100字...</textarea>
                </div>
                <div class="summary-right fr">
                    <div class="summary-right-top">
                        <p><strong>商品合计：</strong><span class="heji">￥199.00</span></p>
                        <p><strong>优惠：</strong><span>￥00</span></p>
                        <p><strong>运费：</strong><span>￥00</span></p>
                        <p><strong>支付价格：</strong> <span class="payment-price">￥199.00</span></p>
                    </div>
                    <a class="to-pay" href="javascript:void(0);">去付款</a>
                </div>
            </div>
        </div>
    </div>

    <!-- footer -->
    <footer></footer>



    <!-- 模板引擎 -->
    <script type="text/html" id="shoppingArr">
        <ul class="shopping-product-list-item">
            <li class="product-tpis">
                <img src="{{shoppingArray.de_img}}" alt="">
                <div class="text">
                    <p class="ellipsis">{{shoppingArray.de_tit}}</p>
                    <span>{{shoppingArray.de_tpis}}</span>
                </div>
            </li>
            <li class="product-price">￥{{shoppingArray.de_pre}}</li>
            <li class="product-number">{{num}}</li>
            <li class="product-y">无商品折扣</li>
            <li class="product-sett">￥{{shoppingArray.de_pre*num}}</li>
        </ul>
    </script>
    <!-- 购买商品 -->
    <script type="text/html" id="shoppingCart">
        {{each shCarPro curr}}
        <ul class="shopping-product-list-item">
            <li class="product-tpis">
                <img src="{{curr.img}}" alt="">
                <div class="text">
                    <p class="ellipsis">{{curr.title}}</p>
                    <span>{{curr.tpis}}</span>
                </div>
            </li>
            <li class="product-price">￥{{curr.price}}</li>
            <li class="product-number">{{curr.num}}</li>
            <li class="product-y">无商品折扣</li>
            <li class="product-sett">￥{{curr.price*curr.num}}</li>
        </ul>
        {{/each}}
    </script>
</body>
</html>